事件冒泡

1.结构上（非视觉上），嵌套关系的元素，会存在事件冒泡的功能，即同一事件，自子元素冒泡向父元素（自底向上）

一个对象的一个事件类型，只能存在一个事件模型，要么冒泡，要么捕获
1。结构上（非视觉上）嵌套关系的元素，会存在事件捕获

触发顺序： 先捕获，后冒泡
focus ,blur, change, submit, reset, select等事件不冒泡

取消冒泡
W3C标准 event.stopPropagation();但不支持ie9以下版本
IE独有	event.cancelBubble = true;

封装取消冒泡
<script type="text/javascript">
	function stopBubble(event){
		if(event.stopPropagation){
			event.stopPropagation()
		}else{
			event.cancelBubble = true;
		}
	}
</script>

阻止默认事件
1.return false
2.event.preventDefault()  W3C标注，IE9以下不兼容
3.event.returnValue = false;不兼容IE

<script type="text/javascript">
	document.oncontextmenu = function (e) {//右键出菜单事件,默认事件
		console.log('a');
		return false;//阻止默认事件，阻止右键菜单；兼容性最好
		e.preventDefault();
		e.returnValue = false;
	}
</script>

封装阻止默认事件的函数
<script type="text/javascript">
	function cancelHandler(event) {
		if(event.preventDefault){
			event.preventDefault();
		}else{
			event.returnValue = false;
		}
	}
</script>

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<a href="#">跳转功能是a标签的默认事件</a>可以把a标签的默认事件取消
	<a href="javascript:void(false)">demo</a>
	<script type="text/javascript">
		var a = document.getElementsByTagName('a');
		a.onclick = function(){
			return false
		}
	</script>
</body>
</html>